import React, { useEffect,useState } from 'react'
import { Button, Descriptions, Empty, Popconfirm } from 'antd';
import myinfo from '../../mobx/info';
import { observer } from 'mobx-react';
import moment from 'moment'
import { ajax } from '../../api';
function Advlist() {
  const {adviseList,userInfo,getAdviseListAsync,getAdviseList} = myinfo
  const role = JSON.parse(JSON.stringify(userInfo)).role
  const [flag,setFlag]=useState(false)
  useEffect(()=>{
    getAdviseListAsync({})
    if(role>2){
      setFlag(true)
  }
  },[])
  const confirm=async (l:any,i:any)=>{
    console.log(l,i);
    let {code ,result}:any = await ajax.deleteadvise({
      _id:l._id
    })
    if(code==200){
       adviseList.splice(i,1)
    }
   
  }
  return (
    <div>
      <h2 style={{fontSize:30}}>物业意见列表</h2>
        {
      (adviseList.length>0)? adviseList.map((l:any,i)=>(
      < Descriptions key={i} style={{background:'rgba(253,245,230)',marginTop:20,padding:10,border:'1px solid rgba(245,222,179)',boxShadow:'0 1px 4px rgba(0, 0, 0, 0.3), 0 0 20px rgba(245,222,179,0.1) inset',borderRadius:'5px'}} title={l.category.join('-')} layout="horizontal">
          <Descriptions.Item label="发布人">{l.userInfo?.username}</Descriptions.Item>
          <Descriptions.Item label="电话号码">{l.userInfo.phone}</Descriptions.Item>
         <Descriptions.Item label="发布时间">{moment(l.time).format('YYYY-MM-DD')}</Descriptions.Item>
        <Descriptions.Item label="发布内容" span={2}>
         {l.content}
      </Descriptions.Item>
    {
      flag&&  <Descriptions.Item label="操作">
      <Popconfirm placement="top" title='确定删除吗？' onConfirm={()=>confirm(l,i)} okText="Yes" cancelText="No">
        <Button>删除</Button>
      </Popconfirm>
      </Descriptions.Item>
    }

      </Descriptions>
         ))
         :(<Empty description={false}/>)
        }
  
    </div>
  )
}

export default observer(Advlist)